<html>
<head>
<title>Graphing Control Panel with Preview</title>
<script type="text/javascript" src="../../../../javascript/ASCIIsvg.js"></script>
<script type="text/javascript" src="AsvgHA.js"></script>
<script type="text/javascript" src="svgcp.js"></script>
</head>
<body onload="setTimeout(function() { opener.setsscr();}, 100);">

<h3 align="center">Equation Grapher Control Panel</h3>

<form>
<div id="options">Equation type: <select id="eqntype" onchange="changetype()">
<option value="func">y=f(x)</option>
<option value="polar">r=f(t)</option>
<option value="param">x=f(t),y=g(t)</option>
<option value="slope">dy/dx = f(x,y)</option>
</select>
&nbsp;&nbsp;&nbsp;
<span id="eq1lbl">f(x)=</span> <input type="text" id="equation" size="15" value="sin(x)"/> <span id="eq2lbl"><i></i></span><span id="eq2"><i></i></span>
&nbsp;from <input type="text" id="xstart" size="4" value=""/> to <input type="text" id="xend" size="4" value=""/>
<HR>

Color: <Select id="gcolor">
	<option value="black">Black</option>
	<option value="red">Red</option>
	<option value="orange">Orange</option>
	<option value="yellow">Yellow</option>
	<option value="green">Green</option>
	<option value="blue">Blue</option>
	<option value="purple">Purple</option>
</select> 
Width: <Select id="strokewidth">
	<option value="1">1</option>
	<option value="2">2</option>
	<option value="3">3</option>
	<option value="4">4</option>
</select> 
Line: <Select id="strokedash">
	<option value="none">Solid</option>
	<option value="2">Dotted</option>
	<option value="5">Dashed</option>
	<option value="5 2">Tight Dash</option>
	<option value="7 3 2 3">Dash-Dot</option>
</select> 

Start with: <Select id="gstart">
	<option value="none">Nothing</option>
	<option value="arrow">Arrow</option>
	<option value="opendot">Open Dot</option>
	<option value="dot">Dot</option>
</select>
End with: <Select id="gend">
	<option value="none">Nothing</option>
	<option value="arrow">Arrow</option>
	<option value="opendot">Open Dot</option>
	<option value="dot">Dot</option>
</select> 
</div>
<HR>

xmin: <input type="text" id="xmin" size="4" value="-7.5" onChange='graphit()'/>
xmax: <input type="text" id="xmax" size="4" value="7.5" onChange='graphit()'/>
xscl: <input type="text" id="xscl" size="3" value="1" onChange='graphit()'/>
&nbsp;&nbsp;
ymin: <input type="text" id="ymin" size="4" value="-5" onChange='graphit()'/>
ymax: <input type="text" id="ymax" size="4" value="5" onChange='graphit()'/>
yscl: <input type="text" id="yscl" size="3" value="1" onChange='graphit()'/>
<HR>

Show axis labels: <input type="checkbox" id="labels" value="Show Labels" onClick='graphit()' CHECKED/>
Show XY grid: <input type="checkbox" id="grid" value="Show Grid" onClick='graphit()' CHECKED/>
&nbsp;&nbsp;
Resize to: <input type="text" id="gwidth" size="5" value="300"/> by <input type="text" id="gheight" size="5" value="200"/>
<input type="button" value="Update" onclick="graphit()"/>
<HR>

<input type="button" value="Add Graph" onclick="addgraph()"/>
Graphs: <select id="graphs" onchange="loadeqn()"></select>
<input type="button" value="Replace Selected Graph" onclick="replacegraph()"/>
<input type="button" value="Remove" onclick="removegraph()"/>
<select id="alignment" onchange="graphit()">
<option value="text-top">Top</option>
<option value="middle">Middle</option>
<option value="text-bottom">Bottom</option>
<option value="left">Float left</option>
<option value="right">Float right</option>
</select>
<HR>

</form>
<center>
<div id="previewdiv"> </div>
<script type="text/javascript">
var isIE = document.createElementNS==null;
if (!isIE) {
  var divnode = document.getElementById('previewdiv');
  divnode.innerHTML = '<embed id="preview" type="image/svg+xml" style="float:none; VERTICAL-ALIGN: middle; WIDTH: 300px; HEIGHT: 200px" src="d1.svg" sscr="-7.5,7.5,-5,5,1,1,1,1,1,300,200" script=" " alt="Graphs: "/><br/>&nbsp;';
  }
</script>
</center>
<center>
<a href="http://www.chapman.edu/~jipsen/svg/asciisvg.html" target="new">
ASCIIsvg</a> by 
<a href="http://www.chapman.edu/~jipsen" target="new">Peter Jipsen</a>, 
<a href="http://www.chapman.edu" target="new">Chapman University</a>
<br/>
HTMLArea AsciiSvg Plugin by 
<a href="http://www.pierce.ctc.edu/dlippman/" target="new">David Lippman</a>, 
<a href="http://www.pierce.ctc.edu" target="new">Pierce College</a>
</center>
</body>
</html>
